<template>
	<view class="fix-top-window" @click="showpp?(showpp=false,showpp1=false,showpp2=false):''">
		<view class="uni-header">
			<uni-stat-breadcrumb class="uni-stat-breadcrumb-on-phone" />
			<view class="uni-group" style="width: 12rem;">
				<servicelist />
			</view>
		</view>
		<view class="uni-container">
			<uni-segmented-control style="width: 20rem;" :current="current" :values="items" :active-color="activeColor"
				@clickItem="onClickItem" />
			<view class="content">
				<view v-show="current === 0">
					<uni-row class="demo-uni-row" :gutter="gutter">
						<uni-col :lg="12" :xs="24">
							<uni-card title="游戏状态" extra="设置游戏状态" style="margin:20px 0 0;padding: 10px;">
								<uni-forms ref="form" label-width="32%">
									<uni-forms-item label="启动ALL">
										<ymx-switch v-model="runStatus" active-text="启动" inactive-text="关闭" :width="50"
											@mchange="controlDst(runStatus,0)"></ymx-switch>
									</uni-forms-item>
									<view v-for="(value, key,index) in worldStatusMap" :key="key">
										<uni-forms-item :label="key">
											<ymx-switch :checked="value" active-text="启动" inactive-text="关闭" :width="50"
												@mchange="controlDst(masterStatus,index+1)"></ymx-switch>
										</uni-forms-item>
									</view>

									<uni-forms-item label="快捷操作">
										<view class="flex-center-r flex pc-flex-wrap" style="gap: 20rpx;">
											<button class="button popup-success uni-icons-reload"
												style="margin-right: 10px;" size="mini" plain type="primary"
												@click="dialogToggle('success',0)">
												<text class="button-text success-text">更新游戏</text>
											</button>
											<button class="uni-icons-pulldown" size="mini" plain type="primary"
												@click="backupGame()">
												创建备份
											</button>
										</view>
									</uni-forms-item>
									<uni-forms-item label="清理存档：">
										<view class="flex-center-r flex">
											<button class="button popup-success uni-icons-trash" style="" size="mini"
												plain type="primary" @click="dialogToggle('success',1)">
												<text class="button-text success-text">清理</text>
											</button>
										</view>
									</uni-forms-item>
									<uni-forms-item label="恢复备份">
										<view class="flex flex-center-r" style="gap: 20rpx;">
											<view class="" style="min-width:6.2rem;width:7.7rem;">
												<uni-data-select
													style="width:8rem;white-space: nowrap;max-height: 100px;"
													v-model="backupName" placeholder="请选择~"
													:localdata="data"></uni-data-select>
											</view>
											<button class="uni-icons-reload" size="mini"
												plain type="primary" @click="dialogToggle('success',2)">
												恢复
											</button>
										</view>
									</uni-forms-item>
									<text
										style="font-size: 14px;font-weight: bold;height: 40px;line-height: 40px;">其他功能</text>
									<uni-forms-item label="仅清理洞穴">
										<view class="flex" style="justify-content: start !important">
											<button title="仅清理洞穴的游戏存档，清理前建议创建存档备份" class="uni-icons-trash" style=""
												size="mini" plain type="primary" @click="dialogToggle('success',3)">
												<text class="button-text success-text">清理洞穴</text>
											</button>
										</view>
									</uni-forms-item>
									<uni-forms-item label="删除存档文件">
										<view class="flex">
											<button title="删除解压出来的存档文件夹，删除之后，当前存档就没有了，删除前建议创建存档备份"
												class="button popup-success uni-icons-trash" style="" size="mini" plain
												type="primary" @click="dialogToggle('success',4)">
												<text class="button-text success-text">删除</text>
											</button>
										</view>
									</uni-forms-item>
								</uni-forms>
							</uni-card>
						</uni-col>
						<uni-col :lg="12" :md="24">
							<uni-card title="存档信息" extra="设置存档信息" style="margin:20px 0 0;padding: 10px;">
								<view class="from-center-text flex flex-between">
									<view class="" style="flex: 1;">
										房间名称 ：{{ gameArchive.clusterName||'未获取到信息 ~' }}
									</view>

								</view>
								<view class="flex flex-between from-center-text">
									<view class="" style="flex: 1;">
										游戏模式 ：{{ transformGameMode(gameArchive.gameMode)||'~ ~ ~' }}
									</view>
									<view class="" style="flex: 1;">
										最大玩家数量 ：{{ gameArchive.maxPlayers || '~ ~ ~' }}
									</view>
								</view>
								<view class="flex flex-between from-center-text">
									<view class="" style="flex: 1;">
										存档天数 ：{{ gameArchive.playDay || '~ ~ ~' }}
									</view>
									<view class="" style="flex: 1;">
										存档季节 ：{{ gameArchive.season || '~ ~ ~' }}
									</view>
								</view>
								<view class="flex flex-between from-center-text">
									<view class="" style="flex: 1;">
										房间密码 ：{{ gameArchive.clusterPassword || '（空）' }}
									</view>
									<view class="" style="flex: 1;">
										模组数量：{{gameArchive.totalModNum || '~ ~ ~' }}
									</view>
								</view>
								<view class="flex flex-between from-center-text">
									<view class="" style="flex: 1;" @click="copy()">
										地址 ：{{ link_code || '~ ~ ~' }}
									</view>
								</view>
								<text
									style="font-size: 14px;font-weight: bold;height: 40px;line-height: 40px;">服务器状态</text>
								<view class="">
									<progress style="" :percent="cpuInfo>100?100:cpuInfo" show-info stroke-width="14" />
									<view class="" style="margin-bottom: 10px;font-size: 12px;">
										<text style="margin-right: 20px;">CPU核心数：{{cpuNum}}</text>
										<text style="margin-right: 20px;">使用率：{{cpuInfo}}%</text>
										<text @click.stop="openymxPP(1)"
											style="color: rgb(0, 122, 255);cursor: pointer;">查看更多</text>
									</view>
								</view>
								<!-- 后期对照品 -->
								<!-- <el-progress  style="width: 50%;" :text-inside="true" :stroke-width="20"
										:color="colors" :percentage="cpuInfo>100?100:cpuInfo"
										:format="format"></el-progress> -->
								<!-- 自制简易提示框 1 -->
								<view class="ymx-pp" v-show="showpp&&showpp1">
									<view class="flex flex-between from-center-text">
										<view class="" style="flex: 1;">
											CPU核心数 ：{{ cpu.cpuNum || '~ ~ ~' }}
										</view>
										<view class="" style="flex: 1;">
											CPU总的使用率 ：{{ cpu.total || '~ ~ ~' }}
										</view>
									</view>
									<view class="flex flex-between from-center-text">
										<view class="" style="flex: 1;">
											CPU系统使用率 ：{{ cpu.sys || '~ ~ ~' }}
										</view>
										<view class="" style="flex: 1;">
											CPU用户使用率 ：{{ cpu.used || '~ ~ ~' }}
										</view>
									</view>
									<view class="flex flex-between from-center-text">
										<view class="" style="flex: 1;">
											CPU当前等待率 ：{{ cpu.wait || '~ ~ ~' }}
										</view>
										<view class="" style="flex: 1;">
											CPU当前空闲率 ：{{ cpu.free || '~ ~ ~' }}
										</view>
									</view>
								</view>
								<view class="">
									<!--  :activeColor="colors"  -->
									<progress style="" :percent="menInfo>100?100:menInfo" show-info stroke-width="14" />
									<view class="" style="margin-bottom: 10px;font-size: 12px;">
										<text style="margin-right: 20px;">总内存：{{menTotal}}GB</text>
										<text style="margin-right: 20px;">使用率：{{menInfo}}%</text>
										<text @click.stop="openymxPP(2)"
											style="color: rgb(0, 122, 255);cursor: pointer;">查看更多</text>
									</view>
								</view>
								<!-- 自制简易提示框 2 -->
								<view class="ymx-pp" v-show="showpp&&showpp2">
									<view class="flex flex-between from-center-text">
										<view class="" style="flex: 1;">
											内存总量 ：{{ men.total || '~ ~ ~' }}
										</view>
										<view class="" style="flex: 1;">
											已用内存 ：{{ men.used || '~ ~ ~' }}
										</view>
									</view>
									<view class="flex flex-between from-center-text">
										<view class="" style="flex: 1;">
											剩余内存 ：{{ men.free || '~ ~ ~' }}
										</view>
									</view>
								</view>
								<text
									style="font-size: 14px;font-weight: bold;height: 40px;line-height: 40px;">在线玩家列表</text>

								<view class=""
									style="background-color: rgba(0, 0, 0, 0.1);width: 100%;box-sizing: border-box;min-height: 218px;padding: 10px;color: #333;overflow: scroll;">
									<view v-for="(item,key) in playerList" style="margin-bottom: 10px;">
										<text>
											{{item}}
										</text>
									</view>
									<text v-if="playerList.length == 0">
										当前世界无玩家
									</text>
								</view>
							</uni-card>
						</uni-col>
					</uni-row>
				</view>
				<view v-show="current === 1">
					<uni-card title="后台控制" thumbnail="" extra="控制中心" note="Tips" style="margin:20px 0 0;padding: 10px;">
						<view style="width: 100%;">
							<uni-row :gutter="gutter">
								<uni-col :lg="8" :md="24">
									<view class="" style="margin-bottom: 10px;">
										发送公告通知
									</view>
									<uni-row :gutter="gutter" style="width: 100%;">
										<uni-col :lg="16" :md="16">
											<textarea class="ymx-input" style="width: 100%;min-height: 60px;"
												placeholder-style="color:#C0C4CC" auto-height v-model="broadcastContent"
												placeholder="请输入内容" />
										</uni-col>
										<uni-col :lg="8" :md="8" style="height: 100%;">
											<view class=""
												style="height: 100%;width: 100%;display: flex;align-items: center;margin: 10px 0;">
												<button class="uni-icons-compose" size="mini" plain type="primary"
													@click="sendBroadcast()">
													发送
												</button>
											</view>
										</uni-col>
									</uni-row>
								</uni-col>
								<uni-col :lg="8" :md="24">
									<view class="" style="margin: 10px 0;">
										地面控制台
									</view>
									<uni-row :gutter="gutter" style="width: 100%;">
										<uni-col :lg="16" :md="16">
											<textarea class="ymx-input" style="width: 100%;min-height: 60px;"
												placeholder-style="color:#C0C4CC" auto-height v-model="worldCommand"
												placeholder="通过代码远程控制地面" />
										</uni-col>
										<uni-col :lg="8" :md="8" style="height: 100%;">
											<view class=""
												style="height: 100%;width: 100%;display: flex;align-items: center;margin: 10px 0;">
												<button class="uni-icons-compose" size="mini" plain type="primary"
													@click="worldConsole()">
													执行
												</button>
											</view>
										</uni-col>
									</uni-row>
								</uni-col>
							</uni-row>
							<view class="" style="margin: 10px 0;">
								踢出玩家:
							</view>
							<uni-row :gutter="gutter" style="width: 100%;">
								<uni-col :lg="16" :md="16">
									<input maxlength="15" placeholder="请输入玩家id" class="ymx-input"
										placeholder-style="color:#C0C4CC" style="width: 100%;min-height: 40px;"
										show-word-limit v-model="kickUserId"></input>
								</uni-col>
								<uni-col :lg="8" :md="8" style="height: 100%;">
									<view class=""
										style="height: 100%;width: 100%;display: flex;align-items: center;margin: 10px 0;">
										<button class="uni-icons-paperplane" size="mini" plain type="warn"
											@click="dialogToggle('success',5)">
											踢出
										</button>
									</view>
								</uni-col>
							</uni-row>
							<uni-row>
								<uni-col :lg="8" :md="24" v-for="item in playerList" style="padding-top: 5px">
									<button @click="kickPlayer2(item)" class="uni-icons-paperplane"
										style="font-size: 12px;color: #287fd1;padding: 10px;">
										踢出
										: {{item}}
									</button>
								</uni-col>
							</uni-row>
							<view class="" style="margin: 10px 0;">
								回滚指定的天数:
							</view>
							<uni-row>
								<uni-col :lg="8" :md="24" style="">
									<button class="uni-icons-loop"
										style="margin-right: 5px;padding: 5px;font-size: 12px;color: #33c1d1;"
										type="default" v-for="item in 5" :key="item+'rollback'" @click="rollback(item)">
										回滚:{{item}}天
									</button>
								</uni-col>
							</uni-row>
							<view class="" style="margin: 10px 0;">
								重置世界:
							</view>
							<uni-row>
								<uni-col :span="15" style="padding-top: 5px">
									<button class="uni-icons-loop" size="mini" plain type="warn"
										@click="dialogToggle('success',6)">
										重置
									</button>
								</uni-col>
							</uni-row>
						</view>
					</uni-card>
				</view>
			</view>
		</view>
		<view>
			<!-- 提示窗示例 -->
			<uni-popup ref="alertDialog" type="dialog">
				<uni-popup-dialog :type="msgType" cancelText="取消" confirmText="确认" title="提示" :content="messageText"
					@confirm="dialogConfirm" @close="dialogClose"></uni-popup-dialog>
			</uni-popup>
		</view>
	</view>
</template>

<script>
	import servicelist from '../servicelist.vue'
	import store from '@/store';
	export default {
		components: {
			servicelist
		},
		data() {
			return {
				link_code: "",
				data: [],
				items: ['服务器面板', '远程控制面板'],
				current: 0,
				activeColor: '#007aff',
				gutter: 20,
				formData: "",
				msgType: 'success',
				messageText: '这是一条成功提示',
				showpp: false,
				showpp1: false,
				showpp2: false,
				visible7: false,
				visible6: false,
				currentTab: 'menus',
				loading: false,
				runStatus: false,
				worldStatusMap: new Map, //世界状态
				backupName: null, //选择的备份文件名称
				backupList: [],
				gameArchive: {},
				visible: false,
				visible1: false,
				// visible2: false,
				visible3: false,
				visible4: false,
				visible5: false,
				cpuInfo: 0,
				cpu: {},
				men: {},
				cpuNum: 0,
				menInfo: 0,
				menTotal: 0,
				timer: null,
				activeName: 'first',
				playerList: [],
				broadcastContent: null, //广播内容
				kickUserId: null, //踢出的玩家
				dayNum: null, //回滚天数
				worldCommand: null, //世界命令
				colors: [{
						color: '#00ff00',
						percentage: 10
					},
					{
						color: '#669900',
						percentage: 20
					},
					{
						color: '#29c1ab',
						percentage: 30
					},
					{
						color: '#33cc00',
						percentage: 40
					},
					{
						color: '#7fff80',
						percentage: 50
					},
					{
						color: '#996600',
						percentage: 60
					},
					{
						color: '#b2cc80',
						percentage: 70
					},
					{
						color: '#cc3300',
						percentage: 80
					},
					{
						color: '#e59980',
						percentage: 90
					},
					{
						color: '#ff0000',
						percentage: 100
					},
				],
				labelPosition: 'left',
				size: 'medium',
				gameData: new Map()
			}
		},
		computed: {
			formatActiveColor() {},
			fengge() {
				let fg = this.gameData.clusterIntentio
				if (fg == "social") {
					return "社交"
				} else if (fg == "cooperative") {
					return "合作"
				} else if (fg == "competitive") {
					return "竞争"
				} else {
					return "疯狂"
				}
			},
			jijie() {
				let jj = this.gameData.season
				if (jj == 'autumn') {
					return "秋天"
				} else if (jj == 'spring') {
					return "春天"
				} else if (jj == 'summer') {
					return "夏天"
				} else {
					return "冬天"
				}
			},
			moshi() {
				let jj = this.gameData.gameMode
				if (jj == '"survival"') {
					return "生存"
				} else if (jj == '"wilderness"') {
					return "荒野"
				} else {
					return "无尽"
				}
			}
		},
		created() {
			const {
				besrurl: teatUrl
			} = store.state.http;
			let ip_reg = /\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}/;
			this.link_code = teatUrl.match(ip_reg)[0] + ":10999"
			//拉取服务器信息
			this.getSystemInfo();

			this.getPlayerList();
			this.getGameArchive();
			// this.getGameData();
			const timer = setInterval(() => {
				this.getSystemInfo();
				// 某些定时器操作   
			}, 10000);
			// 通过$once来监听定时器，在beforeDestroy钩子可以被清除。 
			this.$once('hook:beforeDestroy', () => {
				clearInterval(timer);
			})
			this.getLabelPosition();
		},
		mounted() {
			window.onresize = () => {
				this.getLabelPosition()
			}
		},
		destroyed() {
			clearInterval(this.timer)
		},
		methods: {
			copy() {
				var then = this;
				var data = 'c_connect("';
				var split = this.link_code.split(":")
				data = data + split[0] + '",' + split[1]
				if (this.gameArchive.clusterPassword) {
					data = data + ',"' + this.gameArchive.clusterPassword + '"'
				}
				var data = data + ')';
				uni.setClipboardData({
					data,
					showToast: false,
					success: function(res) {
						then.successMessage('直连代码已复制!');
					}
				})
				/* var e = document.getElementById("copy");
				e.select(); // 选择对象
				document.execCommand("copy"); // 执行浏览器复制命令
				alert("复制成功！"+str); */
			},
			/**
			 * 打开自定义弹窗
			 */
			openymxPP(type) {
				this.showpp = true
				if (type == 1) {
					this.showpp1 = true
					this.showpp2 = false
				} else if (type == 2) {
					this.showpp2 = true
					this.showpp1 = false
				}
			},
			dialogToggle(type, num) {
				if (num == 0) {
					this.messageText = '搜索不到服务器时可以尝试更新游戏，更新时将停止服务器哦！'
				} else if (num == 1) {
					this.messageText = '确认删除解压出来的存档文件夹吗？'
				} else if (num == 2) {
					this.messageText = '确认恢复该存档吗？恢复存档将停止服务器，同时当前游戏进度会被清理哦！'
				} else if (num == 3) {
					this.messageText = '确认清理吗？清理之后将停止服务器,删除洞穴游戏进度哦！'
				} else if (num == 4) {
					this.messageText = '确认删除解压出来的存档文件夹吗？'
				} else if (num == 5) {
					this.messageText = '确认踢出该玩家吗？'
				} else if (num == 6) {
					this.messageText = '确认重置吗？'
				}

				this.typeNum = num
				this.msgType = type
				this.$refs.alertDialog.open()
			},
			dialogConfirm() {
				if (this.typeNum == 0) {
					this.updateGame();
				} else if (this.typeNum == 1) {
					this.clearGame();
				} else if (this.typeNum == 2) {
					this.restoreBackup();
				} else if (this.typeNum == 3) {
					this.delCavesRecord();
				} else if (this.typeNum == 4) {
					this.delMyDediServer();
				} else if (this.typeNum == 5) {
					this.kickPlayer();
				} else if (this.typeNum == 6) {
					this.regenerate();
				}
			},
			dialogClose() {},
			// 选项卡放法
			onClickItem(e) {
				if (this.current != e.currentIndex) {
					this.current = e.currentIndex;
				}
			},
			format(percentage) {
				return percentage === 100 ? '满' : `${percentage}%`;
			},
			//启动饥荒服务
			getGameData() {
				this.$http.get("/home/getGameDetails").then((data) => {
					this.gameData = data.data
				})
			},
			controlDst(status, type) {
				if (status) {
					this.loading = true;
					this.$http.get("/home/start?type=" + type).then((data) => {
						this.loading = false;
						if (data.code != 0) {
							this.warningMessage(data.message);
						} else {
							this.successMessage('执行成功');
						}
						this.getSystemInfo();
					})
				} else {
					this.loading = true;
					this.$http.get("/home/stop?type=" + type).then((data) => {
						this.loading = false;
						if (data.code != 0) {
							this.warningMessage(data.message);
						}
						this.getSystemInfo();
					})
				}
			},
			//清理
			clearGame() {
				this.visible = false; //隐藏
				this.loading = true;
				this.$http.get("/home/delRecord").then((data) => {
					this.loading = false;
					this.getSystemInfo();
					this.successMessage('清理成功');
				})
			},
			//更新
			updateGame() {
				// this.visible2 = false; //隐藏
				this.loading = true;
				uni.showLoading({
					title:"更新中"
				})
				this.$http.get("/home/updateGame").then((data) => {
					this.loading = false;
					uni.hideLoading()
					if (data.code != 0) {
						this.warningMessage(data.message);
					}else{
						this.$message({
							message: "更新成功",
							type: 'success'
						});
					}
					this.getSystemInfo();
				})
			},
			//备份
			backupGame() {
				this.loading = true;
				uni.showLoading({
					title:"创建备份中"
				})
				this.$http.get("/home/backup").then((data) => {
					this.loading = false;
					uni.hideLoading()
					if (data.code != 0) {
						this.warningMessage(data.message);
					}else{
						this.$message({
							message: "创建成功",
							type: 'success'
						});
					}
					this.getSystemInfo();
				})
			},
			//恢复存档
			restoreBackup() {
				this.visible1 = false; //隐藏
				if (this.backupName) {
					this.loading = true;
					this.$http.get("/home/restore?name=" + this.backupName).then((data) => {
						this.loading = false;
						if (data.code != 0) {
							this.warningMessage(data.message);
						}
						this.getSystemInfo();
					})
				} else {
					this.warningMessage('请选择一个存档');
				}
			},
			sendBroadcast() {
				if (this.broadcastContent) {
					this.$http.get("/home/sendBroadcast?message=" + this.broadcastContent).then((data) => {
						if (data.code != 0) {
							this.warningMessage(data.message);
						}
						this.successMessage('执行成功');
					})
				} else {
					this.warningMessage('请填写公告内容');
				}
			},
			getPlayerList() {
				this.$http.get("/home/getPlayerList").then((data) => {
					if (data.code == 0) {
						let nameList = ["沃姆伍德(植物人)", "威尔逊", "微洛(火女)", "沃尔夫冈(大力士)", "温蒂(温武神)","WX-78(机器人)", "微克巴顿(老奶奶)", "伍迪",
							"韦斯", "麦斯威尔", "维格弗德(女武神)", "韦伯(蜘蛛人)", "微诺娜(女工)", "沃利(厨师)",
							"沃拓克斯(恶魔人)", "沃尔特", "沃特", "旺达"
						]
						let vauleList = ["wormwood	", "wilson	", "willow	",
							"wolfgang	", "wendy	", "wx78	", "wickerbottom	", "woodie	", "wes	", "waxwell	",
							"wathgrithr	", "webber	", "winona	", "warly	", "wortox	", "walter	", "wurt	",
							"wanda	"
						]
						data.data.forEach(item => {
							let split = item.split(" ")
							let split1 = split[0] + " " + split[1] + " "
							let ix = vauleList.indexOf(split[2])
							if (ix == -1) {
								split1 += "未知"
							} else {
								split1 += nameList[ix]
							}
							this.playerList.push(split1)
						})
					}
				})
			},
			kickPlayer() {
				this.visible3 = false;
				if (this.kickUserId) {
					this.$http.get("/home/kickPlayer?userId=" + this.kickUserId).then((data) => {
						if (data.code != 0) {
							this.warningMessage(data.message);
						}
						this.successMessage('执行成功');
					})
				} else {
					this.warningMessage('请填写玩家id');
				}
			},
			//踢出玩家
			kickPlayer2(player) {
				let split = player.split(" ");
				this.$http.get("/home/kickPlayer?userId=" + split[0]).then((data) => {
					if (data.code != 0) {
						this.warningMessage(data.message);
					}
					this.successMessage('执行成功');
				})
				this.getPlayerList();
			},
			//重置世界
			regenerate() {
				this.visible5 = false;
				this.$http.get("/home/regenerate").then((data) => {
					if (data.code != 0) {
						this.warningMessage(data.message);
					}
					this.successMessage('执行成功');
				})
			},
			//回滚世界
			rollback(day) {
				this.$http.get("/home/rollback?dayNum=" + day).then((data) => {
					if (data.code != 0) {
						this.warningMessage(data.message);
					}
					this.successMessage('执行成功');
				})
			},
			worldConsole() {
				if (this.masterCommand) {
					this.$http.post("/home/worldConsole?command=" + this.worldCommand + "&world=" + "").then((data) => {
						if (data.code != 0) {
							this.warningMessage(data.message);
						} else {
							this.successMessage('执行成功');
						}
					})
				} else {
					this.warningMessage('请输入代码');
				}
			},
			transformGameMode(gameMode) {
				switch (gameMode) {
					case 'endless':
						return "无尽";
					case 'survival':
						return "默认";
					case 'wilderness':
						return "荒野";
					default:
						return gameMode;
				}
			},
			//存档信息
			getGameArchive() {
				this.$http.get("/home/getGameArchive").then((data) => {
					if (data.code == 0) {
						this.gameArchive = data.data;
					}
				})
			},
			successMessage(message) {
				this.$message({
					message: message,
					type: 'success'
				});
			},
			warningMessage(message) {
				this.$message({
					message: message,
					type: 'warning'
				});
			},
			getSystemInfo() {
				this.$http.get("/home/getSystemInfo").then((data) => {
					if (data.code == 0) {
						this.menInfo = data.data.mem.usage;
						this.menTotal = data.data.mem.total;
						this.cpuNum = data.data.cpu.cpuNum;
						this.cpu = data.data.cpu;
						this.cpuInfo = Math.round((data.data.cpu.sys + data.data.cpu.used) / data.data.cpu.total *
							100);
						this.men = data.data.mem;
						this.masterStatus = data.data.masterStatus;
						this.cavesStatus = data.data.cavesStatus;
						this.backupList = data.data.backupList;
						if (this.backupList.length > 0) {
							let arr = []
							this.backupList.forEach(res => {
								arr.push({
									text: res,
									value: res
								})
							})
							this.data = arr
							//代办
						}
						this.runStatus = true
						this.worldStatusMap = data.data.worldStatusMap
						for (var key in data.data.worldStatusMap) {
							if (!data.data.worldStatusMap[key]) {
								this.runStatus = false
								break
							}
						}
						
					}
				})
			},
			getLabelPosition() {
				let windowWidth = window.innerWidth

				if (windowWidth < 768) {
					this.labelPosition = 'top'
					this.size = 'mini'
				} else {
					this.labelPosition = 'left'
					this.size = 'medium'
				}
			}
		}
	}
</script>

<style scoped>
	.uni-container >>> button{
		margin: 0;
	}
	.text-box {
		width: 100%;
		height: auto;
		display: flex;
		align-items: center;
		/* flex-wrap: wrap;
		flex-grow: 2; */
	}

	>>>.uni-forms-item {
		display: flex;
		flex-wrap: wrap;
		/* justify-content: start; */
	}

	/* #ifdef H5 */
	/* #endif */
	>>>.uni-forms-item__label {
		/* margin-right: 40px; */
	}

	>>>.uni-forms-item__content {
		margin-left: 0 !important;
		display: flex;
		justify-content: space-between;
	}

	.text-box-item {
		/* display: inline-block; */
		width: 50%;
		flex: 1;
		height: 40px;
		line-height: 40px;
		color: #353535;
		font-size: 12px;
	}

	.text-line1 {}

	.from-center-text {
		justify-content: space-between;
		flex-wrap: wrap;
		margin-bottom: 10px;
		font-size: 14px;
	}

	.ymx-pp {
		background-color: rgba(0, 0, 0, 0.6);
		color: #fff;
		padding: 10px;
		border-radius: 20px;
		position: absolute;
		z-index: 999;
		top: 40%;
		width: 90%;
		font-size: 12px;
		box-sizing: border-box;
		left: 50%;
		transform: translateX(-50%);
	}

	.ymx-pp>view {
		flex-wrap: wrap;
	}

	.ymx-input {
		border: #e2e2e2 solid 1px;
		padding: 10px;
		border-radius: 10px;
		box-sizing: border-box;

	}

	>>>.uni-select__input-text {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		width: 6.4rem;
	}

	>>>.uni-select__selector-item span {
		overflow: scroll;
		text-overflow: ellipsis;
		white-space: nowrap;
		width: 7.4rem;
	}

	>>>.uni-scroll-view-content {
		height: 100px;
	}
</style>